<template>
  <header class="header">
    <el-row>
      <el-col :span="4">
        <h1 class="logo"></h1>
      </el-col>
      <el-col :span="20">
        <div>
          <div class="user">
            <!--<i class="profile"></i>-->
            <el-dropdown class="name" trigger="click" @command="clickDropMenu">
              <span class="el-dropdown-link">
                {{login()}}
                <i class="el-icon-arrow-down el-icon--right"></i>
              </span>
              <el-dropdown-menu slot="dropdown">
                <el-dropdown-item command="logout">退出登录</el-dropdown-item>
              </el-dropdown-menu>
            </el-dropdown>
          </div>
        </div>
      </el-col>
    </el-row>
  </header>
</template>

<script>
  export default {
    name: "Header",
    methods: {
      login () {
        if(sessionStorage.getItem('_consumer_info_')=='超级管理员'){
          return `${sessionStorage.getItem('_consumer_info_')}：${sessionStorage.getItem('_user_info_')}`
        }else if(sessionStorage.getItem('_consumer_info_')=='管理员'){
          return `${sessionStorage.getItem('_consumer_info_')}：${sessionStorage.getItem('_user_info_')}`
        }else{
          return sessionStorage.getItem('_user_info_')
        }
      },
      logout(){
        // sessionStorage.removeItem('_user_info_');
        // sessionStorage.removeItem('_consumer_info_');
        sessionStorage.clear()
        this.$router.replace('/')
      },
      clickDropMenu(command){
          if(command === 'logout'){
            this.logout()
          }
      }
    }
  }
</script>

<style scoped>

</style>
